<template>
  <section class="moban2">
    <div v-if="ggBool" class="ggBox">
      <img src="../../assets/img/template-item2/header/bg-gg.png" alt="广告">
      <button @click="closeGg">收起</button>
    </div>
    <my-header :header-obj="headerObj" />

    <router-view />

    <my-footer :footer-obj="footerObj" />
  </section>
</template>

<script>
import myHeader from '../../components/template-item2/header'
import myFooter from '../../components/template-item2/footer'

export default {
  name: 'Main',
  components: { myHeader, myFooter },
  data() {
    return {
      ggBool: true,
      headerObj: {
        logoImg: require('../../assets/img/template-item2/common/logo1.png')
      },
      footerObj: {
        logoImg: require('../../assets/img/template-item2/common/logo3.png'),
        style: {
          backgroundColor: '#2B2D42'
        },
        mostColor: 'rgba(255, 255, 255, 0.6)',
        titColor: '#fff'
      }
    }
  },
  created() {
    console.log('不引用也执行，谢谢--模板2vue-模板2')
  },
  methods: {
    closeGg() {
      this.ggBool = false
    }
  }
}
</script>

<style lang="scss" scoped>
/* 模板2引用 */
@import url('../../assets/template-item2/iconfont/iconfont.css');
@import url('../../assets/template-item2/css/reset.css');
@import url('../../assets/template-item2/css/element.css');
section{
  max-width: 1920px;
  min-width: 1200px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background-color: #fff;
  .ggBox{
    position: relative;
    >img{
      display: block;
      width: 100%;
      max-width: 1920px;
      min-width: 1200px;
    }
    >button{
      width: 54px;
      height: 24px;
      line-height: 24px;
      text-align: center;
      background-color: rgba(0, 0, 0, .16);
      font-size: 14px;
      color: #fff;
      border-radius:2px 2px 8px 2px;
      cursor: pointer;
      position: absolute;
      right: 10px;
      bottom: 2px;
      z-index: 99;
    }
  }
}
</style>

